// ********************************
// Plugin Slide Image - GoSlideImagePlugIn
// Version : 0.01
// Created by : tuanhnm
// Created date : 09/05/2011
// ********************************
// $('.main_slide_container').filter(':not(:animated)').animate({scrollLeft:'+=155'}, 500, function(){});
// **********
// Begin create plugin
// **********
(function(){

    $.fn.GoSlideImageBasic = function () {
      
        // Define repeat function to join array
        function repeat(str, n) {
            return new Array( n + 1 ).join(str);
        }
	  
        return this.each(function(){	  
            // Get direct child div of parent div and set this css to overflow hidden (check if browsers enable javascript) 
            var $wrapper = $('> div', this).css('overflow', 'hidden');        
            // Get ul items of wrapper div and set width 9999
            $slider = $wrapper.find('> .main_slide_container_content').width(9999);		
            // Get li item of ul element 
            $items = $slider.find('> .main_slide_item');			
            // Get single item in li list
            $single = $items.filter(':first');      
            // Get width of single item comprise = width + padding in li list
            $singleWidth = $items.outerWidth(true);				
            // Calculate nums item can be visible by formal : innerWidth's wrapper div / outerWidth's first li item in li list = 315 / 105 = 3 items visible/ page            
            $visible = Math.ceil($wrapper.innerWidth() / $singleWidth),           
            // Set default position page at 1
            $currentPage = 1;            
            // max item per page;
            //$itemPerPage = Math.ceil($wrapper.outerWidth(true) / $singleWidth);                  
            $pages = $items.length;   
            console.log('singleWidth : ' + $singleWidth);
            console.log('visible : ' + $visible);
            console.log('pages : ' + $pages);
            /* TASKS */       
            // 1. pad the pages with empty element if required
            if ($items.length < $visible) {    
                $slider.append(repeat('<div class="main_slide_item empty" />', $visible - ($pages % $visible)));
                $items = $slider.find('> .main_slide_item');
                $('.main_slide_butL').removeClass('main_slide_butL').addClass('disable');                 
                $('.main_slide_butR').removeClass('main_slide_butR').addClass('disable');
            }               
            // 2. create the carousel padding on left and right (cloned)
            // Clone last li of items to insert into start of the list
            $items.filter(':first').before($items.slice(-$visible).clone().addClass('cloned'));          
            // Clone first li of items to insert into end of the list
            $items.filter(':last').after($items.slice(0, $visible).clone().addClass('cloned'));
            $items = $slider.find('> .main_slide_item');        
            // 3. reset scroll
            $wrapper.scrollLeft($singleWidth*$visible);
            // 4. paging function
            function gotoPage(page) {
                //console.log('before : '+page);
                $dir = page < $currentPage ? -1 : 1,
                $n = Math.abs($currentPage - page),
                //left = singleWidth * dir * visible * n;                
                left = 155 * $dir * $n;  
//                console.log($singleWidth);
//                console.log(left);
                $wrapper.filter(':not(:animated)').animate({
                    scrollLeft : '+=' + left
                }, 500, function () {
//                    if (page > $pages){
//                        $wrapper.scrollLeft(155*$visible);
//                        page = 1;
//                    }else if (page == 0){  
//                        $wrapper.scrollLeft(155*$visible);
//                        page = $pages;
//                    } 
                    $currentPage = page;
                });
            }
            
            // 6. bind the back and forward links
            $('.main_slide_butL').click(function () {
                gotoPage($currentPage - 1);
                return false;
            });
            
            $('.main_slide_butR').click(function () {
                gotoPage($currentPage + 1);
                return false;
            });
            
            $(this).bind('goto', function (event, page) {
                gotoPage(page);
                return false;
            });
            
            // THIS IS NEW CODE FOR THE AUTOMATIC INFINITE CAROUSEL
            $(this).bind('next', function () {
                gotoPage($currentPage + 1);
                return false;
            });
			
            $(this).bind('prev', function(){
                gotoPage($currentPage - 1);
                return false;
            });
		
        });
    };

    $.fn.GoSlideImageAdvance = function () {
        // Define repeat function to join array
        function repeat(str, n) {
            return new Array( n + 1 ).join(str);
        }
        return this.each(function(){
            // Get direct child div of parent div and set this css to overflow hidden (check if browsers enable javascript)
            var $wrapper = $('> div', this).css('overflow', 'hidden');
            // Get ul items of wrapper div and set width 9999
            $slider = $wrapper.find('> .aImg_slide_container_content').width(9999),
            // Get li item of ul element
            $items = $slider.find('> .aImg_slide_item'),
            // Get single item in li list
            $single = $items.filter(':first')
            // Get width of single item comprise = width + padding in li list
            $singleWidth = $single.outerWidth(true),
            // Calculate nums item can be visible by formal : innerWidth's wrapper div / outerWidth's first li item in li list = 315 / 105 = 3 items visible/ page
            $visible = Math.ceil($wrapper.innerWidth() / $singleWidth),
            // Set default position page at 1
            $currentPage = 1,
            // Calculate total page by formal : total item of li list / num visible item or page : 15 / 3 = 5 pages
            $pages = Math.ceil($items.length / $visible);
            /* TASKS */
            // 1. pad the pages with empty element if required
            if ($items.length % $visible != 0) {
                $slider.append(repeat('<div class="aImg_slide_item empty" />', $visible - ($items.length % $visible)));
                $items = $slider.find('> .aImg_slide_item');
            }
            // 2. create the carousel padding on left and right (cloned)
            // Clone last li of items to insert into start of the list
            $items.filter(':first').before($items.slice(-$visible).clone().addClass('cloned'));
            // Clone first li of items to insert into end of the list
            $items.filter(':last').after($items.slice(0, $visible).clone().addClass('cloned'));
            $items = $slider.find('> .aImg_slide_item');
            // 3. reset scroll
            $wrapper.scrollLeft($singleWidth * $visible);
            // 4. paging function
            function gotoPage(page) {
                var dir = (page < $currentPage) ? -1 : 1,
                n = Math.abs($currentPage - page);
                $left = $singleWidth * dir * $visible * n;
                $wrapper.filter(':not(:animated)').animate({
                    scrollLeft : '+=' + $left
                }, 1000, function () {
                    if (page > $pages) {
                        $wrapper.scrollLeft($singleWidth * $visible);
                        page = 1;
                    } else if (page == 0) {
                        $wrapper.scrollLeft($singleWidth * $visible * $pages);
                        page = $pages;
                    }
                    $currentPage = page;
                });
            }            
            // 6. bind the back and forward links
            $('.aImg_slide_butL').click(function () {
                //alert('left button ' + currentPage);
                gotoPage($currentPage - 1);
                return false;
            });
            $('.aImg_slide_butR').click(function () {
                //alert('right button' + currentPage);
                gotoPage($currentPage + 1);
                return false;
            });
            $(this).bind('goto', function (event, page) {
                gotoPage(page);
                return false;
            });
            $(this).bind('next', function () {
                gotoPage($currentPage + 1);
                return false;
            });
            $(this).bind('prev', function(){
                gotoPage($currentPage - 1);
                return false;
            });
        });
    }; 
    
})(jQuery);
// **********
// End create plugin
// **********

